<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="css/fancybox.css">
<link rel="stylesheet" href="css/index.css">
<script type="text/javascript" src="js/jquery.js"></script>	
<script type="text/javascript" src="js/fancybox.js"></script>
<script type="text/javascript" src="js/SuperSlide.js"></script>
</head>
<body>
<div class="header">
	<div class="container">
		<div class="left"><a href="###"><h1></h1></a></div>
		<div class="center">
			<li><a href="###">首页</a></li>
			<li><a href="###">隐形车衣</a></li>
			<li><a href="###">玻璃防爆膜</a></li>
			<li><a href="###">车身改色膜</a></li>
			<li><a href="###">施工案例</a></li>
			<li><a href="###">报价系统</a></li>
			<li><a href="###">质保查询</a></li>
			<li><a href="###">关于我们</a>
				<div class="des">
					<div class="main clearfix">
						<a href="###">公司简介</a>
						<a href="###">联系我们</a>
						<a href="###">在线留言</a>
					</div>
				</div>
			</li>
		</div>
		<div class="right"><button></button></div>
	</div>
</div>


<!-- 产品页 -->
<div class="ipro main">
	<div class="htit">
		<h2>隐形车衣</h2>
	</div>
	<div class="ipro_list">
		<div class="ipro_box">
			<div class="text_box">
				<h2>I/影系列</h2>
				<p>特殊透明涂层不仅可以防止由于污染和紫外线导致的膜变色，而且可以通过普通洗涤和干燥来自然修复日常生活中发生 </p>
			</div>
			<div class="img_box">
				<div class="img_box"><img src="images/ipro02.jpg" alt=""></div>
			</div>
		</div>
		<div class="ipro_box">
			<div class="text_box">
				<h2>M/哑光系列</h2>
				<p>特殊透明涂层不仅可以防止由于污染和紫外线导致的膜变色，而且可以通过普通洗涤和干燥来自然修复日常生活中发生 </p>
			</div>
			<div class="img_box">
				<div class="img_box"><img src="images/ipro01.jpg" alt=""></div>
			</div>
		</div>
	</div>
</div>


<!-- video -->
<div class="ivideo main">
	<div class="htit">
		<h2>视频</h2>
	</div>
<!-- 	<a href="###">
		<div class="img_box">
			<img src="images/ivideo01.jpg" alt="">
		</div>
	</a> -->
	
	
	
	<div class="media_box main">
		<div class="video_btn"></div>
		<div class="video_img"></div>
		<video class="video" src="###"></video>
	</div>
	
</div>



<!-- 案例 -->
<div class="case main">
	<div class="htit">
		<h2>案例</h2>
	</div>
	<div class="case_list clearfix">
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_01.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_02.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_03.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_04.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_05.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
		<div class="case_box">
			<a href="###">
			<div class="img_box"><img src="images/case_06.jpg" alt=""></div>
			<div class="text_box"> 劳斯莱斯古斯特—隐形车衣I系列 </div>
			</a>
		</div>
	</div>
	<a href="###" class="btn1"> 查看更多 </a>
</div>





<div class="footer">
	<div class="main">
		<div class="bl">
			<div class="company"> &copy;广州南途汽车用品有限公司 </div>
			<a href="###">粤ICP备19142218号-1</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;技术支持：云路科技
		</div>
		<div class="br">
			<div class="bshare-custom icon-medium-plus">
				<div class="bsPromo bsPromo2"></div>
				<a title="分享到Facebook" class="bshare-facebook" href="javascript:void(0);"></a>
				<a title="分享到推他" class="bshare-tuita" href="javascript:void(0);"></a>
				<a title="分享到微信" class="bshare-weixin" href="javascript:void(0);"></a>
			</div>
		</div>
	</div>
</div>




<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=2&amp;lang=zh"></script>
<script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>
	
<script src="js/index.js"></script>
<script>
	
	let $video_btn = $(".video_btn");
	let $video_img = $(".video_img");
	let $vid = $('.video');
	let flag = 0;
	
	$vid.on('click', function(){
		if(flag == 0){
			$video_img.hide();
			play();
		}else{
			pause();
		}
	});
	$video_btn.on('click', function(){
		$video_img.hide();
		play();
		flag = 1;
	});
	
	$vid.on("pause", function(){
		flag = 0
	});
	$vid.on("play", function(){
		flag = 1
	});
	$vid.on("ended", function(){
		$video_btn.show();
		flag = 0;
	});
	function pause(){
		$video_btn.show();
		$vid.get(0).pause();
		flag = 0;
	}
	function play(){
		$video_btn.hide();
		$vid.get(0).play();
		flag = 1;
	}
</script>
</body>
</html>
